<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>切换搜索引擎</title>
		<style type="text/css">
			img{
				float: left;
			}
			#big{
				position: relative;
			}
			#dier{
				position: absolute;
				margin-top: 10px;
				margin-left: 100px;
			}
			#shuru{
				width: 200px;
			}
			#sousuo{
				background-color: #3399FF;
			}
		</style>
		<script type="text/javascript">
			var hre=["https://www.baidu.com/","https://baike.baidu.com/item/Google/86964?fr=aladdin&fromid=117920&fromtitle=%E8%B0%B7%E6%AD%8C","https://www.taobao.com/"];
			var sr=["img/baidu_web.png","img/google_web-444.png","img/taobao_shopping-446.png"];
			function xuanze(){
				for(var i=0;i<hre.length;i++){
				if(document.getElementsByName("cho")[i].checked){
					document.getElementById("kuang").action=hre[i];
					document.getElementById("tupian").setAttribute("src",sr[i]);
				}
			}
			}
			
		</script>
	</head>
	<body>
		<div id="big">
			<img src="img/baidu_web.png" id="tupian"/>
			<div id="dier">
			<form action="www.baidu.com" method="post" id="kuang">
				<input type="text" name="shuru" id="shuru" />		
			    <span id="sousuo">搜索</span>
			</form>  
			<form action="" method="post" id="la">			
			    <input type="radio" name="cho"  value="baidu" checked="checked" onclick="xuanze()"/>百度
			    <input type="radio" name="cho"  value="guge" onclick="xuanze()"/>谷歌
			    <input type="radio" name="cho"  value="taobao" onclick="xuanze()"/>淘宝
			</form>
			</div>
		</div>
	</body>
</html>
